<!--
 * @Author: chunlai
 * @Date: 2025-08-07 14:08:58
 * @LastEditTime: 2025-08-11 14:18:30
 * @LastEditors: minsheng_insurance_agency_zhoucl
 * @FilePath: \02.bldinsure\src\components\tables\AmntPremTable.vue
 * @Description: 保障责任明细---泰康
-->
<template>
  <div style="width: 100%">
    <table
      align="center"
      border="0"
      cellspacing="0"
      cellpadding="0"
      class="duty_table"
    >
      <thead>
        <tr>
          <th class="w40">保险责任</th>
          <th>保额(元)</th>
          <th>保费(元)</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(dty, idx) in tables" :key="`duty_table-${idx}`">
          <td>{{ dty.name }}</td>
          <td>{{ dty.baoe }}</td>
          <td>{{ dty.baofei }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  name: "AmntPremTable",
  props: {
    tables: {
      type: Array,
      default: () => [],
    },
  },
  components: {},
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {},
};
</script>
<style lang="less" scoped>
.duty_table {
  width: 100%;
  border-collapse: collapse;
  border-left: 1px solid #e6e6e6;
  border-top: 1px solid #e6e6e6;
  background-color: #ffffff;
  th,
  td {
    color: #666666;
    padding: 6px 0;
    text-align: center;
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
  }
  th {
    font-weight: 600;
    line-height: 1;
    &.w40 {
      width: 40%;
    }
  }
}
</style>
